<template>
  <div class="main">
    <gltitle :titleSize="titleSize" :is_mt="is_mt" :titleRight="titleRight" @preserve="preserve"></gltitle>
    <div class="h100"></div>
    <ul class="a_list main_bg">

      <li :class="item.code==currLan?'db on':'db'" v-for="item in list" :key="item.id" @click="setLang(item.code)">
        <div class="flex">{{item.name}}</div>
        <div class="str"><span class="ico"></span></div>
      </li>

      <li class="tac" style="padding: .4rem 0;">
        {{$t('set_lang.orthers_none')}}
      </li>
    </ul>
  </div>
</template>
<script>


  export default {
    data(){
      return {
        titleSize:this.$t('word.switch_lang'),
        is_mt:true,
        titleRight:this.$t('word.save'),
        currLan: "zh",
        list:[]
      }
    },


    mounted() {
      this.currLan = localStorage.getItem("language") || "zh";
      this.$post(this.URL.user.language,{}).then( res =>{
        if(res.code==0){
          res.data.forEach(e => {
            if(e.code=='zh_CN'){
              e.code='zh'
            }else if(e.code=='en_US') {
              e.code='en'
            }else if(e.code=='ja_JP') {
              e.code='jp'
            }else if(e.code=='ko_KR') {
              e.code='ko_KR'
            }
          });
          this.list=res.data;
        }
      })
    },
    methods: {
      preserve(){
        localStorage.setItem("language", this.currLan);
        this.$i18n.locale = this.currLan;
        this.$Local(this.currLan)
        this.$toast.success(this.$t('set_lang.set_done'));
        this.$router.go(-1);
      },
      setLang( lan ){
        this.currLan = lan;
        sessionStorage.removeItem("location_lng");
        sessionStorage.removeItem("location_lat");
      }

    },


  }

</script>


<style lang="less" scoped>
  #app {
    .h100 {
      margin: 0;
    }
    .a_list {
      margin-top: .2rem;
    }
  }
</style>
